var myTable ={
    init:function(){
        this.getTableInfo()
    },
    setViews:function(tableData){
        var titleHtml ='<div ><h1 class="u-tc rating_title">'+tableData.table_title+'</h1></div>',
            baseInfoHtml ='',
            subHtml ='',
            lastHtml ='',
            html = '';
        baseInfoHtml = this.getBaseHtml(tableData.baseInfo);
        subHtml = this.getSubHtml(tableData.rating_info);
        html = titleHtml + baseInfoHtml +subHtml +lastHtml;
        $(".rating_table").append(html)
    },
    getBaseHtml:function(baseInfo){
        var baseInfoHtml = '',
            subHtml ='';
        for(var i =0;i<baseInfo.items.length;i++){
            subHtml += '<p><label>'+ baseInfo.items[i].name+'</label><label><input type="text"></label></p>'
        }
        baseInfoHtml =
            '<div class="baseInfo">' +
            '<p class="title"><span></span><span>'+ baseInfo.title+'</span></p>' + subHtml +
        '</div>'
        return baseInfoHtml;
    },
    getSubHtml:function(rating_info){
        var subHtml ='',
            self= this;
        $.each(rating_info,function(index,item){
            subHtml += self.setSubHtml(index,item)
        })
        return subHtml
    },
    setSubHtml:function(index,items){
        var baseInfoHtml = '',
            subHtml ='';
        $.each(items.course_info,function(index,item){
            subHtml +=
                '<div>' +
                '<p class="subItem"><span>'+(index+1)+'、</span><span>'+ item.item+'</span></p>' +
                '<p class="select_item"><span>'+item.values[0]+'</span><span>'+item.values[1]+'</span><span>'+item.values[2]+'</span><span>'+item.values[3]+'</span><span>'+item.values[4]+'</span></p>' +
                '</div>'
        })
        baseInfoHtml =
            '<div class="rating_info">' +
            '<p class="title"><span></span><span>'+ items.title+'</span></p>' + subHtml +
        '</div>'
        return baseInfoHtml;
    },
    getTableInfo:function(type,data){
        var url = "../mock/rating_table.json",
            self = this;
        $.ajax({
            url: url,
            type: type,
            data: data,
            dataType: 'json',
            success: function (resp) {
                console.log(resp)
                self.setViews(resp)
            },
            error: function (err) {
                console.log(err)
            }
        });
    }
}
myTable.init();